<template>
    <div class="cont">
        <div class="text-2xl">分享设置</div>
        <CustomForm :form-list="formColumns" @submit="onsubmit"></CustomForm>
    </div>
</template>

<script setup lang="ts">
import CustomForm from '@/components/customForm/CustomForm.vue';
import { CustomFormItem, CustomFormState } from '@/components/customForm/types';

const formColumns = reactive<CustomFormItem[]>([
    {label: '分享标题',key: 'title',type: 'input'},
    {label: '自定义分享描述',key: 'remark',type: 'input'},
    {label: '页面 path',key: 'title',type: 'input',help:'页面path, 必须是以 / 开头的完整路径'},
    {label: '分享图标',key: 'title',type: 'upload',help:'路径可以是本地文件路径、代码包文件路径或者网络图片路径。显示图片长宽比是 5:4'},
    { value: '提交并保存', key: 'submit', type: 'submit' }
])

const onsubmit = (formState: CustomFormState) => {
    alert(JSON.stringify(formState))
}
</script>

<style scoped>

</style>